import React from 'react';
import ReactEChart from 'echarts-for-react';

export default function Pie({
    StyleData,
    data,
    title,
    showSidebar = false,
    isEmpty = false,
    isArea = false
}) {
    const options = {
        title: {
            text: title,//标题
            left: "left"//放在哪里
        },
        tooltip: {
            trigger: "item"
        },
        legend: showSidebar && { orient: "vertical", left: "left", top: "center" },
        // 数据渲染
        series: {
            name: title,
            type: "pie",
            center: ["55%", "55%"],
            radius: isEmpty ? ['50%', '70%'] : "50%",
            roseType: isArea && 'area',
            data,
            itemStyle: {
                emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, .0.5)',
                },
                normal: {
                    label: {
                        show: true,
                        formatter: `{b} ({d}%)`
                    },
                    labelLine: { show: true }
                }
            }
        }

    }
    return (
        <div className='staff-amount-container' style={StyleData}>
            <ReactEChart className="react_for_echarts" option={options}></ReactEChart>
        </div>
    )
}
